<template>
  <el-badge :value="value" :is-dot="isDot" />
</template>

<script lang="ts">
import { Vue, Component, Prop, Watch } from "vue-property-decorator";

@Component({
  name: "LyMenuItemTip",
  components: {},
})
export default class LyMenuItemTip extends Vue {
  //#region vue prop =================================
  @Prop({
    type: Boolean,
    default: false,
  })
  isDot: boolean;
  @Prop({
    type: [String, Number],
    default: "",
  })
  value: string | number;

  //#endregion

  //#region vue data =================================

  //#endregion
  //#region computed getter =================================

  //#endregion
  //#region vue life =================================
  created() {
    console.log("LyMenuItemTip " + "created");
  }

  mounted() {
    console.log("LyMenuItemTip " + "mounted");
  }

  beforeDestroy() {
    console.log("LyMenuItemTip " + "beforeDestroy");
  }

  //#endregion
  //#region comp getter =================================

  //#endregion
  //#region server data =================================

  //#endregion
  //#region components Func =================================

  //#endregion
  //#region Public Func =================================

  //#endregion
  //#region view layout =================================

  //#endregion
}
</script>
<style lang="scss"></style>
<style lang="scss" scoped>
::v-deep .el-badge {
  position: absolute;
  top: 5px;
  right: 20px;
}
::v-deep .el-submenu__title .el-badge {
  right: 35px;
}
</style>
